<style lang="less">
    
</style>

<template>
    <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80" >
        <FormItem label="机构名称" prop="name">
            <Input v-model="formValidate.name" placeholder="请输入机构名称"></Input>
        </FormItem>
        <FormItem label="联系人" prop="contact">
            <Input v-model="formValidate.contact" placeholder="请输入联系人"></Input>
        </FormItem>
        <FormItem label="联系方式" prop="mobile" >
            <Input v-model="formValidate.mobile" placeholder="请输入联系方式"></Input>
        </FormItem>
        <FormItem>
            <Button type="primary" @click="handleSubmit('formValidate')">提交</Button>
            <Button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</Button>
        </FormItem>
    </Form>
</template>

<script>
import http from '../../../libs/http';
export default {
    data () {
        const validePhone = (rule, value, callback) => {
            var re = /^1[3|4|5|7|8][0-9]{9}$/;
            if (!re.test(value)) {
                callback(new Error('请输入正确格式的手机号'));
            } else {
                callback();
            }
        };
        return {
            id: '',
            formValidate: {
                name: '',
                contact: '',
                mobile: ''
            },
            ruleValidate: {
                    name: [
                        { required: true, message: '机构名不能为空', trigger: 'blur' }
                    ],
                    contact: [
                        { required: true, message: '联系人不能为空', trigger: 'change' }
                    ],
                    mobile: [
                        { required: true, message: '联系方式不能为空', trigger: 'blur' },
                        { validator: validePhone}
                    ]
                }

        }
    },
    methods: {
        handleSubmit (name) {
            this.$refs[name].validate((valid) => {
                if (valid) {
                    //提交后台
                    var data = {
                        id: this.id,
                        name: this.formValidate.name,
                        contact: this.formValidate.contact,
                        mobile: this.formValidate.mobile
                    }
                    console.log(data);
                    this.apiPost('admin/organization/edit', data).then((res) => {
                        if (res.code != 200) {
                            this.handleError(res);
                        } else {
                            this.$Message.success('编辑信息成功');
                            this.$emit('closeEditWindow');
                        }
                    });
                } else {
                    this.$Message.error('表单验证失败!');
                }
            })
        },
        handleReset (name) {
            this.$refs[name].resetFields();
        },
        getInfo (id) {
            var that = this;
            var url = 'admin/organization/read/' + id;
            this.apiGet(url).then((res) => {
                if (res.code != 200) {
                    this.handleError(res);
                } else {
                    that.formValidate = {
                        name: res.data.name,
                        contact: res.data.contact,
                        mobile: res.data.mobile
                    }
                }
            })
        }
    },
    watch: {
        editid: function (newid) {
            if (newid != null) {
                this.getInfo(newid);
                this.id = newid;
            }
        }
    },
    mixins: [http],
    props: ['editid']
}
</script>
